<template>
  <div class="orders">
    <el-tabs v-model="activeName" @tab-click="handleClick" class="top">
      <el-tab-pane label="线下订单" name="first"> 
        <router-view />
        
      </el-tab-pane>
      <el-tab-pane label="小程序订单" name="second">
        <router-view />

      </el-tab-pane>
    </el-tabs>
  </div>

</template>

<script>
  export default {
    data() {
      return {
        activeName: this.$store.state.orderActive
      };
    },
    created(){
      this.$router.push('/home/order/' + (this.$store.state.orderActive == 'first' ? 'offlineOrders' : 'miniProgramsOrder'))
    },
    methods: {
      handleClick(tab, event) {
        // console.log(tab.index, event);
        switch(tab.index){
          case '0':
            this.$router.push('/home/order/offlineOrders')
            this.$store.state.orderActive = 'first'
            break;
          case '1':
            this.$router.push('/home/order/miniProgramsOrder')
            this.$store.state.orderActive = 'second'
            break;
          default:
            this.$message('啥也没发生')
        }
      }
    }
  };
</script>

<style scoped>
.top{
  line-height: 40px;
}
</style>